<template>
  <lay-layer v-model="layerRef.open"
             :title="layerRef.title"
             :area="layerRef.area"
             :shade-close="layerRef.shadeClose"
             :maxmin="layerRef.maxmin">

    <div style="padding: 20px">
      <lay-form :model="dictData"
                ref="layDictDataForm"
                :label-position="'right'"
                isLabelTooltip
                labelWidth="130px" style="margin: 20px">
        <lay-form-item label="字典标签" prop="dictLabel" :required="layerRef.required">
          <lay-input v-model="dictData.dictLabel" :disabled="layerRef.disabled"></lay-input>
        </lay-form-item>

        <lay-form-item label="字典键值" prop="dictValue" :required="layerRef.required">
          <lay-input v-model="dictData.dictValue" :disabled="layerRef.disabled"></lay-input>
        </lay-form-item>

        <lay-form-item label="字典排序" prop="dictSort" :required="layerRef.required" mode="inline">
          <lay-input-number v-model="dictData.dictSort" :disabled="layerRef.disabled"></lay-input-number>
        </lay-form-item>

        <lay-form-item label="是否默认" prop="isDefault" style="width: 300px!important;"
                       :required="layerRef.required" mode="inline">
          <lay-radio v-model="dictData.isDefault" name="isDefault" value="1" label="是"
                     :disabled="layerRef.disabled"></lay-radio>
          <lay-radio v-model="dictData.isDefault" name="isDefault" value="0" label="否"
                     :disabled="layerRef.disabled"></lay-radio>
        </lay-form-item>
        <lay-form-item label="有效标志" prop="validFlag" :required="layerRef.required" mode="inline">
          <lay-radio v-model="dictData.validFlag" name="validFlag" value="Y" label="有效"
                     :disabled="layerRef.disabled"></lay-radio>
          <lay-radio v-model="dictData.validFlag" name="validFlag" value="N" label="无效"
                     :disabled="layerRef.disabled"></lay-radio>
        </lay-form-item>

        <lay-form-item label="备注" prop="remarks">
          <lay-textarea v-model="dictData.remarks" :disabled="layerRef.disabled"></lay-textarea>
        </lay-form-item>

      </lay-form>

    </div>


    <template v-slot:footer>
      <div class="fly-form-footer">
        <lay-button v-if="layerRef.submit" class="fly-button fly-ok-button " @click="saveDictDataHandler">
          <lay-icon class="layui-icon-ok"></lay-icon>
          保存
        </lay-button>
        <lay-button class="fly-button fly-close-button" @click="onTapClose">
          <lay-icon class="layui-icon-close"></lay-icon>
          关闭
        </lay-button>
      </div>
    </template>


  </lay-layer>
</template>


<script setup lang="ts" name="refDictData">
import {reactive, ref} from "vue";
import {FormTypeEnum} from "@/fly/biz/BizModel";
import {DictData} from "@/api/admin/model/DictDataModel";
import useTenantInfoComposable from "@/composables/admin/DictDataComposable";
import {DictType} from "@/api/admin/model/DictTypeModel";

const {
  dictData,
  dictDataDataHandler
} = useTenantInfoComposable();

const layDictDataForm = ref<any>();

/* 弹窗 */
const layerRef = reactive<any>({
  open: false,
  title: '数据字典',
  area: ['1200px', '460px'], // 宽度,  高度
  disabled: false,
  shadeClose: false,
  maxmin: false,
  submit: true,
})


/**
 * 提交
 */
function saveDictDataHandler() {
  layDictDataForm.value.validate((isValidate: boolean, model: DictData, errors: any[]) => {
    if (!isValidate) {
      return;
    }
    dictDataDataHandler(model);
  });
}


//显示弹框
const open = (type: FormTypeEnum, dictType: DictType, row?: DictData) => {
  layerRef.title = type + '数据字典信息表';
  if (null !== row) {
    dictData.value = JSON.parse(JSON.stringify(row))
    dictData.value.typeLabel = dictType.dictLabel;  // 数据字典类型名称
    dictData.value.dictType = dictType.dictType;  // 字典类型, 例如:Y_OR_N
  } else {
    dictData.value = {
      id: '',  // 数据字典ID
      typeId: dictType.id,  // 数据字典类型ID
      typeLabel: dictType.dictLabel,  // 数据字典类型名称
      dictType: dictType.dictType,  // 字典类型, 例如:Y_OR_N
      dictLabel: '',  // 字典标签
      dictValue: '',  // 字典键值
      isDefault: '0',  // 是否默认（1是 0否）
      dictSort: '9',  // 字典排序
      validFlag: 'Y',  // 是否展示/有效标志: Y-有效;N-无效
      remarks: ''  // 备注
    }
  }

  layerRef.disabled = false;
  layerRef.submit = true;
  layerRef.required = true;
  if (FormTypeEnum.VIEW === type) {
    layerRef.disabled = true;
    layerRef.submit = false;
    layerRef.required = false;
  }

  layerRef.open = true;
};


/**
 * 关闭按钮
 */
const onTapClose = () => {
  layerRef.open = false;
}


//在组件中，属性和方法，只能对当前template,
//外部需要使用的时候，需要使用 defineExpose 暴露出去给父组件
defineExpose({
  open,
  onTapClose
});

//注册事件
// const emit = defineEmits(['click']);

</script>


<style scoped>

</style>